{% extends 'base.html' %}
{% block title %}My Foot Stamp{% endblock %}
{% block stylesheet %}
{{ block.super }}
<link rel="stylesheet" type="text/css" href="{{ STATIC_PREFIX }}css/d/masonry.css" />
<style type="text/css">
</style>
{% endblock%}

{% block javascript %}
{{ block.super }}
<script type="text/javascript">
$(document).ready( function(){
    $('h3').live('click', function(){
        var ids = $(this).attr('id');
        var id = ids.split('-')[0];
        var ss = ids.split('-')[1];
        if(ss == 'show') {
            $(this).next().hide();
            $(this).attr('id', id + '-hide');
        } else if(ss == 'hide'){
            $(this).next().show();
            $(this).attr('id', id + '-show');
        } else {
            var address = 'id/'+ id + '/';
            $(this).next().load(address);
            //$(this).next().show();
            $(this).attr('id', id + '-show');
        }       
    });
});
</script>
{% endblock%}

{% block content %}

{% for c in categories %}
<h3 id="{{ c.id }}-load">{{ c.name }} - {{ c.store_set.count }}</h3>
<div id="{{ c.id }}">
</div>
{% endfor %}

{% endblock %}
